<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=gbk"/>
    <meta http-equiv="X-UA-Compatible" content="IE=8"/>
    <title>Edit todo item</title>
    <link rel="stylesheet" href="../style/default.css"/>

</head>

<body>
<div class="title">
    <h1>Edit todo item</h1>
</div>
<div class="body">
    <p>Editing a todo item refers to editing text information in the item.</p>
    <p>The to-do item's title, description, and other contents of each column can be edited.</p>
    <p>Before editing, first specify the cell you want to edit.</p>
    <p>Click in a cell to make focused;</p>
    <p>Focused cell will be outlined with a dotted rectangle;
        it is now the target of editing operation.</p>
    <p>The following two pictures show different focused cells' appearance:</p>
    <div>
        <img src="image/edit_focus_1.png" alt=""/>
    </div>
    <div>
        <img src="image/edit_focus_2.png" alt=""/>
    </div>
    <p>Click on the Edit button in the toolbar, or by pressing the F2 key, to enter Edit State.</p>
    <div>
        <img src="image/btn_edit.png" alt=""/>
        <img src="image/editing.png" alt=""/>
    </div>
    <p>Click the Edit button again, or press the Enter key to complete editing and exit the Edit State.</p>
    <p>If you want to cancel editing and restore original content, press the Esc key.</p>
</div>
</body>
</html>
